<template>
  <div class="mainBox flex flex_column">
    <!-- 搜索     -->
    <div class="btnCon flex flex_between">
      <div class="plop flex">
        <el-select
                        filterable
          v-model="search.warehouseCode"
          placeholder="请选择仓库"
          size="small"
          @change="getDataLists"
        >
          <el-option
            v-for="item in warhouseList"
            :key="item.warehouseID"
            :label="item.warehouseName"
            :value="item.warehouseCode"
          />
        </el-select>
        <el-button
          type="primary"
          class="ml15"
          size="small"
          icon="el-icon-plus"
          @click="newlyBuild"
           v-permission="'MenuCode5-9-1'"
          >新建
        </el-button>
      </div>
      <!--      搜索框-->
      <div class="search">
        <el-input
          v-model="search.likeWords"
          placeholder="输入关键字"
          size="small"
          @keyup.enter.native="getDataLists"
        >
          <el-button
            slot="append"
            :loading="searchLoading"
            type="primary"
            icon="el-icon-search"
            :disabled="searchLoading"
            element-loading-spinner="el-icon-loading"
            @click="getDataLists"
          >
            搜索
          </el-button>
        </el-input>
      </div>
    </div>
    <!--    高级搜索版块-->
    <div class="seniorSearch flex flex_end">
      <div class="flex">
        <!--          <div class="c_3F61F1">高级搜索</div>-->
        <!--          <span class="line"/>-->
        <div class="pointer" @click="Refresh">
          <i class="el-icon-refresh-right" />
        </div>
        <span class="line" />
        <!--        表头设置-->
        <div class="setting flex">
          <HeadSeting
            :list-data.sync="tableHead"
            :table-code="$config.stockBalanceList"
            @reset="getTableHead"
          />
        </div>
      </div>
    </div>
    <!--table板块-->
    <div ref="tableCon" class="tableCon">
      <el-table
        v-show="tableHead.length > 0"
        id="emtable"
        ref="multipleTable"
        v-loading="searchLoading"
        :data="dataList"
        :height="tableHeight || 'auto'"
        border
        highlight-current-row
        fit
        style="width: 100%"
        @header-dragend="surverWidth"
      >
        <!-- 复选框       -->
        <!--        <el-table-column type="selection" width="40" fixed="left" />-->
        <template v-for="(fruit, index) in tableHead">
          <el-table-column
            v-if="fruit.visible"
            :key="index"
            :label="fruit.columnName"
            :min-width="fruit.columnWidth || 110"
            :prop="fruit.columnCode"
            show-overflow-tooltip
            :fixed="fruit.isFloat ? 'left' : false"
          >
            <template slot-scope="scope">
              {{ scope.row[fruit.columnCode] }}
            </template>
          </el-table-column>
        </template>
        <el-table-column label="操作" width="70px" fixed="right" align="center">
          <template slot-scope="scope">
            <div>
              <el-popover
                :ref="`popover-${scope.$index}`"
                placement="bottom-end"
                popper-class="tableOp"
                width="160"
                :popper-options="{
                  boundariesElement: 'opBox',
                  removeOnDestroy: true,
                }"
                trigger="click"
              >
                <div class="operation">
                  <ul v-for="(arry, arryIndex) in operations" :key="arryIndex">
                    <template v-for="(op, opIndex) in arry">
                      <template v-if="op.key === 'delete'">
                        <li
                          :key="opIndex"
                          @click="optionsClick(op.key, scope.row)"
                        >
                          {{ op.text }}
                        </li>
                      </template>
                      <li
                        v-else
                        :key="opIndex"
                        @click="optionsClick(op.key, scope.row)"
                      >
                        {{ op.text }}
                      </li>
                    </template>
                  </ul>
                </div>
                <div slot="reference" class="opBox pointer">
                  <span class="el-icon-more c_3F61F1" />
                </div>
              </el-popover>
            </div>
          </template>
        </el-table-column>
      </el-table>
      <!-- 骨架屏     -->
      <div v-if="tableHead.length == 0" class="p16">
        <el-skeleton :rows="6" animated />
      </div>
    </div>
    <!-- 分页 S-->
    <div
      class="d_pag"
      style="display: felx; justify-content: flex-start; width: 100%"
    >
      <pagination
        :total="total || 0"
        :page.sync="search.pageIndex"
        :limit.sync="search.pageSize"
        @pagination="getDataLists"
      />
    </div>
    <!-- 分页 E-->
    <!-- 结存新建入库 -->
    <el-dialog
      title="新建结存"
      :visible.sync="isAddDialog"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      width="85%"
      @close="closeDialog"
    >
      <div class="dialogDody">
        <div class="subTip">
          <span class="mr15"
            ><span class="mr5">入库单号：</span
            >{{ balanceForm.stockBalanceBillNo }}</span
          >
          <span class="mr15"
            ><span class="mr5">创建日期：</span
            >{{
              balanceForm.stockBalanceDate || dayjs().format("YYYY-MM-DD")
            }}</span
          >
          <span
            ><span class="mr5">创建人员：</span
            >{{ balanceForm.stockBalancePersonName || name }}</span
          >
        </div>
        <div class="addWuliaoBox">
          <div class="dialogFormCon">
            <el-form
              ref="balanceForm"
              :model="balanceForm"
              :rules="rules"
              label-width="80px"
              label-position="left"
              class="dialogForm dialogInlineForm"
            >
              <el-row>
                <el-col :span="8">
                  <el-form-item label="结存仓库" prop="warehouseCode">
                    <el-select
                        filterable
                      v-model="balanceForm.warehouseCode"
                      placeholder="请选择仓库"
                      size="small"
                      @change="getBalanceInfoLists()"
                    >
                      <el-option
                        v-for="item in warhouseList"
                        :key="item.warehouseID"
                        :label="item.warehouseName"
                        :value="item.warehouseCode"
                      />
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="结存月份" prop="excuteYearMonth">
                    <el-date-picker
                      v-model="balanceForm.excuteYearMonth"
                      type="month"
                      value-format="yyyy-MM"
                      size="small"
                      placeholder="选择月"
                    >
                    </el-date-picker>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="结存备注" prop="stockBalanceRemark">
                    <el-input
                      v-model="balanceForm.stockBalanceRemark"
                      type="textarea"
                      :rows="1"
                      placeholder="入库备注"
                      size="mini"
                      clearable
                    />
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
          <div class="tableBox" ref="dialogTableBox">
            <div class="tt flex flex_between" ref="tableTT">
              <span class="fw">结存明细</span>
            </div>
            <el-table
              ref="addTables"
              v-loading="InfoLoading"
              :data="balanceInfoList"
              height="350"
              v-if="isShow"
              border
              :summary-method="getSummaries"
              show-summary
              destroy-on-close
              style="width: 100%"
            >
              <el-table-column type="index" label="序号" fixed width="50" />
              <el-table-column
                label="物料编号"
                fixed
                prop="stockGoodsCode"
                show-overflow-tooltip
                min-width="110"
              />
              <el-table-column
                label="物料名称"
                fixed
                prop="goodsName"
                show-overflow-tooltip
                min-width="110"
              />
              <el-table-column
                label="规格型号"
                fixed
                prop="stockGoodsName"
                min-width="90"
              />
              <el-table-column
                label="物料分组"
                prop="groupName"
                min-width="90"
              />
              <el-table-column
                label="物料类型"
                prop="categoryName"
                min-width="90"
              />
              <el-table-column
                label="供应商"
                prop="supplierName"
                show-overflow-tooltip
                min-width="90"
              />
              <el-table-column
                label="物料单位"
                prop="goodsUnitName"
                min-width="80"
              />
              <el-table-column
                label="转换比例"
                prop="specificationJsValue"
                min-width="80"
              />
              <el-table-column
                label="批次单价"
                prop="batchCaiGouPrices"
                min-width="80"
              />
              <el-table-column
                label="上月结存数量"
                sortable
                show-overflow-tooltip
                prop="lastTimeJcQuantity"
                min-width="130"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="thisTimeJcSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="lastMonthJcSumValue"
                min-width="110"
              />
              <el-table-column
                label="结存数量"
                sortable
                show-overflow-tooltip
                prop="thisTimeJcQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="thisTimeJcSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="thisTimeJcSumValue"
                min-width="110"
              />
              <el-table-column
                label="入库数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthRkQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthRkSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthRkSumValue"
                min-width="110"
              />
              <el-table-column
                label="采购数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthCgQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthCgSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthCgSumValue"
                min-width="110"
              />
              <el-table-column
                label="退料数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthScTlQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthScTlSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthScTlSumValue"
                min-width="110"
              />
              <el-table-column
                label="出库数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthCkQuantity"
                min-width="120"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthCkSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthCkSumValue"
                min-width="110"
              />
              <el-table-column
                label="领料数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthScLlQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthScLlSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthScLlSumValue"
                min-width="110"
              />
              <el-table-column
                label="调机领料数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthTjLlQuantity"
                min-width="130"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthTjLlSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthTjLlSumValue"
                min-width="110"
              />
              <el-table-column
                label="退货数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthThQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthThSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthThSumValue"
                min-width="110"
              />
              <el-table-column
                label="报废数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthBfCkQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthBfCkSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthBfCkSumValue"
                min-width="110"
              />
              <el-table-column
                label="实盘数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthPdQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthPdSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthPdSumValue"
                min-width="110"
              />
              <el-table-column
                label="盘点结果"
                sortable
                show-overflow-tooltip
                prop="currentMonthPdResultName"
                min-width="110"
              />
              <el-table-column
                label="盈亏数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthCzQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthCzSquare"
                min-width="110"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthCzSumValue"
                min-width="110"
              />
            </el-table>
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isAddDialog = false">取 消</el-button>
        <!-- 新增       -->
        <el-button
          :loading="addLoading"
          :disabled="addLoading"
          element-loading-spinner="el-icon-loading"
          type="primary"
          size="mini"
          @click="savaAdd"
          >保存</el-button
        >
      </div>
    </el-dialog>
    <!-- 查看结存入库 -->
    <el-dialog
      title="查看结存"
      :visible.sync="isSeeDialog"
      :close-on-click-modal="false"
      custom-class="bodyNoPadDialog bigDialog"
      width="85%"
      destroy-on-close
      @close="closeDialog"
    >
      <div class="dialogDody">
        <div class="subTip">
          <span class="mr15"
            ><span class="mr5">入库单号：</span
            >{{ balanceForm.stockBalanceBillNo }}</span
          >
          <span class="mr15"
            ><span class="mr5">创建日期：</span
            >{{
              balanceForm.stockBalanceDate || dayjs().format("YYYY-MM-DD")
            }}</span
          >
          <span
            ><span class="mr5">创建人员：</span
            >{{ balanceForm.createPersonName }}</span
          >
        </div>
        <div ref="addWuliaoBox" class="addWuliaoBox">
          <div ref="dialogFormCon" class="dialogFormCon">
            <el-form
              ref="balanceForm"
              :model="balanceForm"
              :rules="rules"
              disabled
              label-width="80px"
              label-position="left"
              class="dialogForm dialogInlineForm"
            >
              <el-row>
                <el-col :span="8">
                  <el-form-item label="结存仓库" prop="warehouseCode">
                    <el-select
                        filterable
                      v-model="balanceForm.warehouseCode"
                      placeholder="请选择仓库"
                      size="small"
                      @change="getBalanceInfoLists()"
                    >
                      <el-option
                        v-for="item in warhouseList"
                        :key="item.warehouseID"
                        :label="item.warehouseName"
                        :value="item.warehouseCode"
                      />
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="结存月份" prop="excuteYearMonth">
                    <el-input
                      v-model="balanceForm.excuteYearMonth"
                      placeholder=""
                      size="mini"
                      disabled
                    />
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="24">
                  <el-form-item label="结存备注" prop="stockBalanceRemark">
                    <el-input
                      v-model="balanceForm.stockBalanceRemark"
                      type="textarea"
                      :rows="1"
                      placeholder="入库备注"
                      size="mini"
                      clearable
                    />
                  </el-form-item>
                </el-col>
              </el-row>
            </el-form>
          </div>
          <div class="tableBox">
            <div class="tt flex flex_between">
              <span class="fw">结存明细</span>
            </div>
            <el-table
              ref="addTables"
              v-loading="InfoLoading"
              :data="balanceInfoList"
              border
              :summary-method="getSummaries"
              show-summary
              height="350"
              style="width: 100%"
            >
              <el-table-column type="index" label="序号" fixed width="50" />
              <el-table-column
                label="物料编号"
                fixed
                prop="stockGoodsCode"
                show-overflow-tooltip
                min-width="110"
              />
              <el-table-column
                label="物料名称"
                fixed
                prop="goodsName"
                show-overflow-tooltip
                min-width="110"
              />
              <el-table-column
                label="规格型号"
                fixed
                prop="stockGoodsName"
                min-width="90"
              />
              <el-table-column
                label="物料分组"
                prop="groupName"
                min-width="90"
              />
              <el-table-column
                label="物料类型"
                prop="categoryName"
                min-width="90"
              />
              <el-table-column
                label="供应商"
                prop="supplierName"
                show-overflow-tooltip
                min-width="90"
              />
              <el-table-column
                label="物料单位"
                prop="goodsUnitName"
                min-width="80"
              />
              <el-table-column
                label="转换比例"
                prop="specificationJsValue"
                min-width="80"
              />
              <el-table-column
                label="批次单价"
                prop="batchCaiGouPrices"
                min-width="80"
              />
              <el-table-column
                label="上月结存数量"
                sortable
                show-overflow-tooltip
                prop="lastMonthJcQuantity"
                min-width="130"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="lastMonthJcSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="lastMonthJcSumValue"
                min-width="110"
              />
              <el-table-column
                label="结存数量"
                sortable
                show-overflow-tooltip
                prop="thisTimeJcQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="thisTimeJcSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="thisTimeJcSumValue"
                min-width="110"
              />
              <el-table-column
                label="入库数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthRkQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthRkSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthRkSumValue"
                min-width="110"
              />
              <el-table-column
                label="采购数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthCgQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthCgSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthCgSumValue"
                min-width="110"
              />
              <el-table-column
                label="退料数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthScTlQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthScTlSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthScTlSumValue"
                min-width="110"
              />
              <el-table-column
                label="出库数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthCkQuantity"
                min-width="120"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthCkSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthCkSumValue"
                min-width="110"
              />
              <el-table-column
                label="领料数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthScLlQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthScLlSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthScLlSumValue"
                min-width="110"
              />
              <el-table-column
                label="调机领料数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthTjLlQuantity"
                min-width="130"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthTjLlSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthTjLlSumValue"
                min-width="110"
              />
              <el-table-column
                label="退货数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthThQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthThSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthThSumValue"
                min-width="110"
              />
              <el-table-column
                label="报废数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthBfCkQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthBfCkSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthBfCkSumValue"
                min-width="110"
              />
              <el-table-column
                label="实盘数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthPdQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthPdSquare"
                min-width="100"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthPdSumValue"
                min-width="110"
              />
              <el-table-column
                label="盘点结果"
                sortable
                show-overflow-tooltip
                prop="currentMonthPdResultName"
                min-width="110"
              />
              <el-table-column
                label="盈亏数量"
                sortable
                show-overflow-tooltip
                prop="currentMonthCzQuantity"
                min-width="110"
              />
              <el-table-column
                label="平方米"
                sortable
                show-overflow-tooltip
                prop="currentMonthCzSquare"
                min-width="110"
              />
              <el-table-column
                label="总金额"
                sortable
                show-overflow-tooltip
                prop="currentMonthCzSumValue"
                min-width="110"
              />
            </el-table>
          </div>
        </div>
      </div>
      <div slot="footer" class="dialog-footer">
        <el-button size="mini" @click="isSeeDialog = false">取 消</el-button>
        <!-- 确定       -->
        <el-button
          type="primary"
          v-if="ops == 'see'"
          size="mini"
          @click="isSeeDialog = false"
          >确定</el-button
        >
        <!--  确认入库      -->
        <el-button
          v-if="ops === 'confirm'"
          v-loading="addLoading"
          :disabled="addLoading"
          element-loading-spinner="el-icon-loading"
          type="primary"
          size="mini"
          @click="savaConfirm"
          >确认</el-button
        >
      </div>
    </el-dialog>
  </div>
</template>
<script>
import Pagination from "@/components/Pagination";
import HeadSeting from "@/components/HeadSeting";
import { arraySort } from "@/utils";
import { mapGetters } from "vuex";

export default {
  name: "Balance",
  components: { Pagination, HeadSeting },
  computed: {
    ...mapGetters(["name"]),
  },
  data() {
    return {
      ops: "see", // 表格操作
      isSeeDialog: false, // 查看结存弹框是否打开
      InfoLoading: false, // 结存明细列表加载效果
      addLoading: false, // 新建结存加载效果
      balanceForm: {
        stockBalanceBillNo: "系统自动生成",
        excuteYearMonth: "",
        warehouseCode: "",
        stockBalanceRemark: "",
        detailList: [],
      },
      balanceInfoList: [], // 结存明细列表
      operations: [
        [{ text: "查看", key: "see" }],
      ], // 表格操作
      isAddDialog: false, // 新建弹框是否打开
      searchLoading: false,
      search: {
        pageIndex: 1,
        pageSize: 30,
        likeWords: "",
        warehouseCode: "",
        excuteYearMonth: "",
      }, // 结存搜索条件
      total: 0,
      warhouseList: [], // 仓库下拉列表数据
      dataList: [], // 入库列表
      tableHead: [], // 入库表头
      tableHeight: null, // 表格最大高度
      jcINfoTableHeight: null, // 结存明细表格最大高度
      stockBalanceBillNo: "", // 结存单号
      isShow:false,
      rules: {
        warehouseCode: [
          { required: true, message: "请选择结存仓库", trigger: "change" },
        ],
        excuteYearMonth: [{ required: true, trigger: "change" }],
      },
    };
  },
  created() {
    // 获取仓库下拉列表
    this.getWarehouseList();
    // 列表表格头部
    this.getTableHead();
  },
  mounted() {
    // 初始化表格高度
    this.calHeight();
  },
  updated() {
    this.$nextTick(() => {
      this.$refs.multipleTable.doLayout();
    });
  },
  methods: {
    optionsClick(key, data) {
      if (key === "see") {

        this.getBalanceInfo(data.stockBalanceID);
      } else if (key === "delete") {
        this.ops = "delete";
        this.blanceDelete(data.stockBalanceID);
      }
    },
    // 删除结存单
    blanceDelete(id) {
      const parmas = {
        stockBalanceID: id,
      };
      this.$confirm("确定删删除结存单, 是否继续?", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      }).then(() => {
        this.$api.warehouse.DeleteStockBalance(parmas).then(() => {
          this.getDataLists();
          this.$message({
            message: "删除成功",
            type: "success",
          });
        });
      });
    },
    // 获取结存列表某一条的详细信息
    getBalanceInfo(id) {
      const parmas = {
        queryBy: 1,
        stockBalanceID: id,
      };
      this.InfoLoading = true;
      this.$api.warehouse.GetSingleStockBalance(parmas).then((res) => {
        this.balanceForm = res;
        this.balanceInfoList = res.detailList;
        this.InfoLoading = false;
        this.isSeeDialog = true;
      });
    },
    // 新建点击事件
    newlyBuild() {
      let date = new Date()
      let year = date.getFullYear()
      let month = date.getMonth() + 1
      this.balanceForm.warehouseCode = this.warhouseList[0].warehouseCode;
      this.balanceForm.stockBalanceRemark = "";
      this.balanceForm.excuteYearMonth = year + '-' + month.toString().padStart(2,'0')
      console.log(this.balanceForm.excuteYearMonth)
      this.getBalanceInfoLists();
        this.isAddDialog = true;
        setTimeout(()=>{
          this.isShow = true
          },700)
    },
    // 新建结存保存方法
    savaAdd() {

      this.$refs.balanceForm.validate((valid) => {
        if (valid) {
          this.addLoading = true;
          let obj = {
            excuteYearMonth: this.balanceForm.excuteYearMonth,
            warehouseCode: this.balanceForm.warehouseCode,
          };
          this.$api.warehouse.JuadgeIsHaveStockBalanceBill(obj).then((res) => {
            this.balanceForm.detailList = this.balanceInfoList;
            const parmas = this.balanceForm;
            if (res) {
              this.$confirm("检测到存在该结存单, 是否进行覆盖?", "提示", {
                confirmButtonText: "确定",
                cancelButtonText: "取消",
                type: "warning",
              })
                .then(() => {
                  this.$api.warehouse
                    .UpdateStockBalanceBill(parmas)
                    .then(() => {
                      this.$message({
                        message: "修改成功",
                        type: "success",
                      });
                      // 结存列表
                      this.getDataLists();
                      this.isAddDialog = false;
                      this.addLoading = false;
                    })
                    .catch(() => {
                      this.addLoading = false;
                    });
                })
                .catch(() => {
                  this.isAddDialog = false;
                  this.addLoading = false;
                });
            } else {
              this.$api.warehouse
                .AddStockBalance(parmas)
                .then(() => {
                  this.$message({
                    message: "新建成功",
                    type: "success",
                  });
                  // 结存列表
                  this.getDataLists();
                  this.isAddDialog = false;
                })
                .catch(() => {
                  this.addLoading = false;
                });
            }
          });
        }
      });
    },
    // 合计方法
    getSummaries(param) {
      const { columns, data } = param;
      const sums = [];
      columns.forEach((column, index) => {
        if (index === 0) {
          sums[index] = "合计";
          return;
        }
        if(column.label!= '转换比例'){

          const values = data.map((item) => Number(item[column.property]));
          if (!values.some((value) => isNaN(value))) {
            sums[index] = values.reduce((prev, curr) => {
              const value = Number(curr);
              if (!isNaN(value)) {
                return prev + curr;
              } else {
                return prev;
              }
            }, 0);
            // sums[index] = sums[index]++;
            if(sums[index]){
              sums[index] = sums[index].toFixed(4)
            }
          } else {
            sums[index] = " ";
          }
        }
      });
      return  sums;
    },
    // 结存明细列表
    getBalanceInfoLists() {
      const parmas = {
        excuteYearMonth: this.balanceForm.excuteYearMonth,
        warehouseCode: this.balanceForm.warehouseCode,
      };
      this.InfoLoading = true;
      this.$api.warehouse
        .GetStockBalanceStockGoodsData(parmas)
        .then((res) => {
          this.InfoLoading = false;
          this.balanceInfoList = res;
        })
        .catch(() => {
          this.InfoLoading = false;
        });
    },
    // 结存列表
    getDataLists() {
      const parmas = this.search;
      this.searchLoading = true;
      this.$api.warehouse
        .GetMatchPageStockBalances(parmas)
        .then((res) => {
          this.dataList = res.list;
          this.dataList.forEach((item)=>{
            for(let i in item){
              if(!item[i] && item[i] !== 0){
                item[i] = '--'
              }
            }
          })
          this.total = res.totalCount;
          this.searchLoading = false;
        })
        .catch(() => {
          this.searchLoading = false;
        });
    },
    // 全部入库列表，清除所有查询条件
    Refresh() {
      this.search = this.$options.data().search;
      this.getDataLists();
    },
    // 获取仓库下拉列表
    getWarehouseList() {
      this.$api.warehouse.getWarehouseList().then((res) => {
        this.warhouseList = res;
        this.search.warehouseCode = res[0].warehouseCode;
        // 结存列表
        this.getDataLists();
      });
    },
    calHeight() {
      this.$nextTick(() => {
        const rect = this.$refs.tableCon.getBoundingClientRect();
        this.tableHeight = rect.height;
      });
    },
    // 保存表头样式变化
    saveHead(newArray) {
      const parmas = newArray;
      setTimeout(() => {
        this.$api.common.saveTableStyle(parmas).then(() => {});
      }, 300);
    },
    // 保存表头列宽度
    surverWidth(newWidth, oldWidth, column) {
      setTimeout(() => {
        const heads = [...this.tableHead];
        heads.forEach((item) => {
          if (item.columnCode === column.property) {
            item.columnWidth = column.width;
            return;
          }
        });
        this.saveHead(heads);
      }, 100);
    },
    // 列表表格头部
    getTableHead() {
      const parmas = {
        tableCode: this.$config.stockBalanceList,
      };
      this.$api.common.getAllTableHead(parmas).then((res) => {
        res.sort(arraySort("columnSort"));
        this.tableHead = res;
      });
    },
    // 弹框关闭事件
    closeDialog() {},
  },
};
</script>
<style lang="scss" scoped>
.addWuliaoBox {
  padding: 10px 16px;
  overflow: hidden;
  .tableBox {
    flex: 1;
    margin-top: 16px;
    border: 1px solid #e6e6e6;
    border-bottom: none;
    border-radius: 8px 8px 0 0;
    overflow: hidden;
    display: flex;
  flex-direction: column;

    .tt {
      height: 38px;
      line-height: 38px;
      padding-left: 16px;
      background: #f7f8fa;
      border-radius: 8px 8px 0 0;
    }
  }
}
.subTip {
  border-bottom: 1px #e6e6e6 solid;
  background: #f5f6f9;
  padding: 8px 16px;
}

.el-table__footer{
  height: 100px !important;
}
</style>
